<template>
  <div >
    
  <!-- {{counter}}
   <div class="min-h-screen bg-gradient-to-br from-indigo-100 to-purple-50 flex flex-col items-center justify-center p-6">
    <h1 class="text-4xl font-extrabold text-transparent bg-clip-text bg-gradient-to-r from-blue-600 to-purple-600 mb-6">
      {{ message }}
    </h1>
    <button class="px-8 py-3 bg-blue-600 hover:bg-blue-700 text-white font-medium rounded-lg shadow transition transform hover:scale-105">
      Click Me
    </button> -->{{ userList }}---
     <!-- {{ counter?.useList }}--
    {{ counter.count }} -->
   
    {{ useCounterStore().useList }}
  </div>

</template>
<script setup lang="ts">
import {nextTick, onMounted, ref} from "vue"
import { useCounterStore } from '@/store/counter'



// const counter = useCounterStore()

// 调用action
// counter.increment()
// counter.increment()
// counter.increment()
// console.log(counter.count,"333")
const userList = ref([])

onMounted( async() => {
await  useCounterStore().getUsers()
  userList.value = useCounterStore().userList



})
</script>